<template>
    <div>
        <input type="text" v-model="cs.name"><input type="button" value="查找" @click="show">
        <table class="table table-bordered">
            <tbody>
                <tr>
                    <td>商品名称</td>
                    <td>价格</td>
                    <td>类型</td>
                    <td>要求</td>
                    <td>生产时间</td>
                    <td>过期时间</td>
                    <td>商品状态</td>
                    <td>操作</td>
                </tr>
                <tr v-for="a in as.row" :key="a.id">
                    <td>{{ a.name }}</td>
                    <td>{{ a.money }}</td>
                    <td>{{ a.sname }}</td>
                    <td>{{ a.yao }}</td>
                    <td>{{ a.time1 }}</td>
                    <td>{{ a.time2 }}</td>
                    <td>{{ a.style == true ? "上架" : "下架" }}</td>
                    <td>
                        <input type="button" value="删除" @click="del(a.id)">
                        <button @click="up(a.id)">{{ a.style == true ? "下架" : "上架" }}</button>
                        <input type="button" value="查看详情" @click="xing(a.id)">
                        <input type="button" value="查看图片" @click="imger(a.id)">
                        <input type="button" value="修改" @click="update(a.id)">
                    </td>

                </tr>
            </tbody>
        </table>
        <table>
            <span>当前{{ cs.pageindex }}页</span>--
            <span>共{{ as.pagecount }}条</span>--
            <span>当前{{ cs.pageindex }}/{{ as.sizecount }}页</span>
            <input type="button" value="首页" @click="fy(1)">
            <input type="button" value="上一页" @click="fy(cs.pageindex - 1)">
            <input type="button" value="下一页" @click="fy(cs.pageindex + 1)">
            <input type="button" value="尾页" @click="fy(as.sizecount)">
        </table>
    </div>


</template>

<script setup lang="ts">
import axios from 'axios';
import { ref, reactive, onMounted } from "vue";
import moment from 'moment';
import { useStore } from '@/stores/kll';
import { useRouter, useRoute } from "vue-router";
const router = useRouter();
const route = useRoute();
const a = useStore();
let cs: any = reactive(
    {
        pageindex: 1,
        pagesize: 2,
        name: ''
    }
)
let as: any = reactive(
    {
        pagecount: 0,
        sizecount: 0,
        row: []
    }
)

let v: any = ref(true);
const fy = (f: any) => {
    if (f < 1) {
        cs.pageindex = 1;
        return;
    }
    if (f > as.sizecount) {
        cs.pageindex = as.sizecount;
        return;
    }
    cs.pageindex = f;
    show();
}
onMounted(() => {
    if(a.useinfo.id)
{
        show();
        bing();
}
else{
    router.push("/Login");
}

})
let list: any = ref([]);
const bing = () => {
    axios({
        url: 'https://localhost:7298/api/Emp/bind',
        method: 'get',
        params: as
    })
        .then(res => {
            console.log(res);
            list.value = res.data;
        })
        .catch(err => {
            console.log(err);

        })
}
const show = () => {
    axios({
        url: 'https://localhost:7298/api/Emp/show',
        method: 'get',
        params: cs
    })
        .then(res => {
            console.log(res);
            as.pagecount = res.data.pagecount;
            as.sizecount = res.data.sizecount;
            as.row = res.data.row
        })
        .catch(err => {
            console.log(err);

        })
}
const del = (id: any) => {
    axios({
        url: 'https://localhost:7298/api/Emp/del',
        method: 'post',
        params: {
            id: id
        }
    })
        .then(res => {
            console.log(res);
            if (res.data > 0) {
                alert("删除成功");
                show();
            }

        })
        .catch(err => {
            console.log(err);

        })
}
const up = (id: any) => {
    let f = confirm("确认修改吗？");
    if (f) {
        axios({
            url: 'https://localhost:7298/api/Emp/up',
            method: 'post',
            params: {
                id: id
            }
        })
            .then(res => {
                console.log(res);
                if (res.data > 0) {
                    alert("修改成功");
                    show();
                }

            })
            .catch(err => {
                console.log(err);

            })
    }

}
const xing=(id:any)=>{
    router.push({
        path:'/Xiang',
        query:{
            id:id
        }
    })
}
const imger=(id:any)=>{
    router.push({
        path: '/Imger',
        query: {
            id: id
        }
    })
}
const update=(id:any)=>{
    router.push({
        path:'/Xiu',
        query:{
            id:id
        }
    })
}
</script>

<style scoped></style>